<template functional>
  <a-sub-menu :key="props.menuInfo.key">
    <span slot="title">
      <a-icon v-if="props.menuInfo.icon" :type="props.menuInfo.icon" />
      <span>{{ props.menuInfo.title }}</span>
    </span>
    <template v-for="item in props.menuInfo.children">
      <a-menu-item v-if="!item.children" :key="item.key">
        <!-- <router-link :to="props.linkFront + item.url"> -->
          <!-- <a href="javascript:;" @click="openTabs(item)"> -->
            <a-icon v-if="item.icon" :type="item.icon" />
            <span>{{ item.title }}</span>
          <!-- </a> -->
        <!-- </router-link> -->
      </a-menu-item>
      <sub-menu v-else :key="item.key" :menu-info="item" />
    </template>
  </a-sub-menu>
</template>
<script>
export default {
  props: ['menuInfo', 'linkFront'],
};
</script>